<template>
	<view class="content">
		<nav-bar title='详情' black bgColor="rgba(255,255,255,0)" titleColor="#333333"></nav-bar>
		<view class="head">
			<view class="title">
				{{title}}
			</view>
			<view class="time-box">
				<view class="time">
					发布于 {{time}}
				</view>
				<view class="zan" @click="zanTap">
					<u-icon v-if="zanShow" name="thumb-up-fill" color="#fc9b63" size="38rpx"></u-icon>
					<u-icon v-else name="thumb-up" size="38rpx"></u-icon>{{praise}}
				</view>
			</view>
		</view>
		<view class="text">
			<u-parse :content="content"></u-parse>
		</view>
	</view>
</template>

<script>
	const app = getApp()
	export default {
		data() {
			return {
				id:'',
				title:'',
				time:'',
				content: '',
				zanShow:false,
				praise:0,
				is_praise:1,
			}
		},
		onLoad(e){
			console.log(e);
			this.id = e.id;
			app.login();
			this.get_data();
		},
		methods: {
			get_data(index) {
				var _this = this;
				app._get('article/get_data_info', {
					id:_this.id,
				}, function(res) {
					console.log('获取数据');
					console.log(res);
					if(res.code == -2){
						app.showError(res.msg,function(){
							uni.redirectTo({
								url: "/pages/vipBuyPage/vipBuyPage"
							})
						})
						
					}else{
						var article = res.article
						_this.title = article.title;
						_this.time = article.article_time;
						_this.praise = article.praise;
						_this.is_praise = article.is_praise;
						_this.content = article.content;
					}
					
				});
			},
			zanTap(){
				let that = this;
				var is_praise = that.is_praise;
				if(is_praise == 1){
					app.showMsg('已点过');
					return false;
				}else{
					app._post_form('article/post_praise', {
						cid:app.globalData.cid,
						id: that.id,
					}, function(result) {
						that.praise = result.praise;
						that.is_praise = 1;
					}, false, function() {
					});
				}
				/*that.zanShow = !that.zanShow;
				if(that.zanShow){
					that.praise ++;
				}else{
					that.praise --;
				}
				console.log(that.praise)*/
			}
		}
	}
</script>

<style lang="less">
	.content{
		padding: 32rpx;
		.head{
			margin: 30rpx 0;
			.title{
				font-size: 38rpx;
				font-weight: bold;
				color: #000000;
				margin-bottom: 20rpx;
			}
			.time-box{
				display: flex;
				align-items: center;
				.time{
					font-size: 24rpx;
					color: #bcbcbc;
					margin-right: 30rpx;
				}
				.zan{
					display: flex;
					align-items: center;
					font-size: 24rpx;
					color: #a7a7a7
				}
			}
		}
	}
</style>